<!--
 * @Description: 文件描述
 * @Version: 1.0
 * @Author: YueXuanzi
 * @Date: 2024-09-09 14:42:20
 * @LastEditors: YueXuanzi
 * @LastEditTime: 2024-10-08 16:53:48
 * @心得体会: 无
-->
<!--
 * @Description: 文件描述,
 * @Version: 1.0
 * @Author: YueXuanzi
 * @Date: 2024-09-08 17:43:33
 * @LastEditors: YueXuanzi
 * @LastEditTime: 2024-10-06 21:34:00
 * @心得体会: 无
-->
<template>
    <!-- 表格显示 -->
    <el-table :data="tableData" style="width: 100%" border height="60vh" highlight-current-row>
        <!-- <el-table-column fixed type="selection" width="50" /> -->
        <el-table-column prop="visitId" label="序号" width="80" align="center"></el-table-column>
        <el-table-column prop="name" label="姓名"  align="center"></el-table-column>
        <el-table-column prop="sex" label="性别"  align="center">
            <template v-slot="scope">
                <!-- 标签 -->
                <el-tag v-if="scope.row.sex == 1" type="success">男</el-tag>
                <el-tag v-else type="primary">女</el-tag>
            </template>
        </el-table-column>
        <el-table-column prop="diagnosis" label="诊断"  align="center"></el-table-column>
        <el-table-column prop="haveDrug" label="用药"  align="center">
            <template v-slot="scope">
                <!-- 标签 -->
                <el-tag v-if="scope.row.haveDrug == 1" type="success">有</el-tag>
                <el-tag v-else type="primary">无</el-tag>
            </template>
        </el-table-column>
        <el-table-column prop="haveProject" label="检查"  align="center">
            <template v-slot="scope">
                <!-- 标签 -->
                <el-tag v-if="scope.row.haveProject == 1" type="success">有</el-tag>
                <el-tag v-else type="primary">无</el-tag>
            </template>
        </el-table-column>
        <el-table-column prop="haveInhospital" label="住院"  align="center">
            <template v-slot="scope">
                <!-- 标签 -->
                <el-tag v-if="scope.row.haveInhospital == 1" type="success">有</el-tag>
                <el-tag v-else type="primary">无</el-tag>
            </template>
        </el-table-column>
        <el-table-column prop="advice" label="建议"  align="center"></el-table-column>
        <el-table-column prop="createTime" label="就诊时间"  align="center"></el-table-column>
        <el-table-column label="操作"  align="center">
            <template #default="scope">
                <el-button type="primary" @click="toRegister(scope.row)">查看详情</el-button>
            </template>
        </el-table-column>
    </el-table>
    <el-dialog v-model="dialogVisible" title="详情查看" width="400" :before-close="handleClose">
        <el-form :model="formData" label-width="auto" class="w-full">
            <el-form-item label="医生姓名">
                <el-text class="w-40">{{ formData.name }}</el-text>
            </el-form-item>
            <el-form-item label="描述">
                <el-text class="w-40">{{ formData.description }}</el-text>
            </el-form-item>
            <el-form-item label="医生诊断">
                <el-text class="w-40">{{ formData.diagnosis }}</el-text>
            </el-form-item>
            <el-form-item label="处理方式">
                <el-text class="w-40">{{ formData.method }}</el-text>
            </el-form-item>
            <el-form-item label="医生建议">
                <el-text class="w-40">{{ formData.doctorDescribe }}</el-text>
            </el-form-item>
            <el-form-item label="医嘱">
                <el-text class="w-40">{{ formData.advice }}</el-text>
            </el-form-item>
            <el-form-item label="时间">
                <el-text class="w-40">{{ formData.createTime }}</el-text>
            </el-form-item>
            <!-- 药品 -->
            <el-form-item label="药品" v-show="formData.haveDrug">
                <el-table :data="formData.drugs" style="width: 100%" border height="20vh" highlight-current-row>
                    <el-table-column prop="drugId" label="序号" width="80" align="center"></el-table-column>
                    <el-table-column prop="drugName" label="药品名"  align="center"></el-table-column>
                    <el-table-column prop="drugNumber" label="数量"  align="center"></el-table-column>
                </el-table>     
            </el-form-item>
            <!-- 项目 -->
            <el-form-item label="项目" v-show="formData.haveProject">
                <el-table :data="formData.projects" style="width: 100%" border height="20vh" highlight-current-row>
                    <el-table-column prop="projectInspectionId" label="序号" width="80" align="center"></el-table-column>
                    <el-table-column prop="projectName" label="项目名"  align="center"></el-table-column>
                </el-table>   
            </el-form-item>
            <!-- 是否住院 -->
            <el-form-item label="是否住院">
                <el-tag v-if="formData.haveInhospital" type="primary">是</el-tag>
                <el-tag v-else type="success">否</el-tag>
            </el-form-item>
            
            <el-form-item>
                <el-button type="primary" @click="handleClose">
                    确定
                </el-button>
            </el-form-item>
        </el-form>
    </el-dialog>
</template>

<script setup>
import { computed, ref, reactive } from 'vue'
import { ElMessageBox, ElMessage } from 'element-plus'
import { getList,getVisitLogByPID } from "@/api/doctor/record.js"
import { useRouter } from 'vue-router'
// 表格数据
const tableData = ref([
    {id: 1, doctorImg: "@/assets/img/xx.png", doctorName: "张三", sex: "男", description: "我是一个好医生", phonenumber: "123456789", price: "100", status: 1},
    {id: 2, doctorImg: "@/assets/img/xx.png", doctorName: "张三", sex: "男", description: "我是一个好医生", phonenumber: "123456789", price: "100", status: 1},
    {id: 3, doctorImg: "@/assets/img/xx.png", doctorName: "张三", sex: "男", description: "我是一个好医生", phonenumber: "123456789", price: "100", status: 1}
])
const formData = reactive({
    visitId: "",
    patientId: "",
    name:"",
    description : "",
    method : "",
    diagnosis : "",
    doctorDescribe : "",
    outcome : "",
    haveDrug : "",
    haveProject : "",
    haveInhospital : "",
    createTime:"",
    advice : "",
      // 药品添加
    drugs : [],
      // 检验项目
    projects : [],
})
let dialogVisible = ref(false)
// 初始化数据
initData()
// 初始化方法
function initData(){
    getList().then(res =>{
        console.log(res)
        // 初始化表格数据
        tableData.value = res.records
    })
}
function toRegister(row){
    console.log("查看详情")
    getVisitLogByPID(row.visitId).then(res =>{
        console.log(res)
        formData.drugs = res.visitLog.drugs
        formData.projects = res.visitLog.projects
    })
    formData.name = row.name
    formData.visitId = row.visitId
    formData.patientId = row.patientId
    formData.description = row.description
    formData.method = row.method
    formData.diagnosis = row.diagnosis
    formData.doctorDescribe = row.doctorDescribe
    formData.advice = row.advice
    formData.haveDrug = row.haveDrug
    formData.haveProject = row.haveProject
    formData.haveInhospital = row.haveInhospital
    formData.createTime = row.createTime
    dialogVisible.value = true
    console.log(formData)
}

</script>

<style scoped>

</style>